<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>江西财经大学迎新网</title>
    <script src="javascripts/jquery.min.js"></script>
    <link rel="icon" href="img/JXCJ.jpg" />
    <link rel="stylesheet" href="css/index.css" />
    <link rel="stylesheet" href="css/logIn.css" />
    <!-- 2023.10.19 熊健先 -->
  </head>
  <body>
    <div class="header">
      <div class="header_con">
        <div class="logo">
          <img src="img/logo.png" alt="" srcset="" />
        </div>
        <div class="Nav">
          <ul>
            <li><a href="index.html">首页</a></li>
            <li><a href="school.html?theme=入学指南">入学指南</a></li>
            <li><a href="school.html?theme=新闻动态">新闻动态</a></li>
          </ul>
          <div class="Nav_que">
            <a href="school.html?theme=学校简介">学校简介</a>
            <img src="img/code.jpg" alt="" srcset="" />
          </div>
        </div>
      </div>
    </div>
    <div class="logIn_body">
      <div class="logInBox">
        <h1>预报道注册</h1>
        <div class="form">
          <input type="text" name="uname" placeholder="请输入录取通知书编号" />
          <input type="password" name="upassword" placeholder="请输入身份证后八位" />
          <button>注册</button>
        </div>
        <script>
          $(() => {
            $('.form')
              .children('button')
              .click(() => {
                // 请求参数
                const params = {
                  uname: $('.form').children('input').eq(0).val(),
                  upassword: $('.form').children('input').eq(1).val(),
                }
                // 将请求参数转换为URLSearchParams对象
                const formData = new URLSearchParams()
                for (const key in params) {
                  formData.append(key, params[key])
                }

                fetch('/register', {
                  method: 'POST',
                  body: formData,
                }).then((response) => {
                  if (response.status == 200) {
                    //获取响应头中的token值，并写入浏览器缓存
                    // let token = response.headers.get('Authorization')
                    // window.localStorage.setItem('token', token)

                    $('.message')
                      .text(`注册成功,欢迎你,${$('.form').children('input').eq(0).val()}!`)
                      .css({ display: 'flex', color: 'green' })
                    setTimeout(function () {
                      $('.message').css('display', 'none')
                      window.location.href = '/school.html'

                      //获取登录或注册后存在浏览器的token值，而后发送请求都需将token值置于请求头中，供给服务器检验
                      // let token = window.localStorage.getItem('token').split(' ')[1]
                      // let headers = { Authorization: `Bearer ${token}` }
                      // fetch('/testToken', { headers })
                      //   .then((response) => response.json())
                      //   .then((data) => {
                      //     console.log(data)
                      //   })
                    }, 1500)
                  } else if (response.status == 250) {
                    $('.message').text('注册失败，用户名可能重复').css({ display: 'flex', color: 'red' })
                    setTimeout(function () {
                      $('.message').css('display', 'none')
                      $('.form').children('input').eq(0).val('')
                      $('.form').children('input').eq(1).val('')
                    }, 1500)
                  } else {
                    console.log('请求失败', response.status)
                    alert('请求失败，请检查网络信息')
                  }
                })
              })
          })
        </script>
        <div class="tips">
          <p><span>*</span>新生登陆账号为录取通知书编号</p>
          <p><span>*</span>密码为身份证号码后八位</p>
          <p><span>*</span>港澳台籍新生登录密码为护照号前4位</p>
        </div>
      </div>
      <div class="message"></div>
    </div>
  </body>
</html>
